import Label from '../Label'

const data = [
  { name: '年生产塑料编织袋', value: 39, name2: '10亿条' },
  { name: '出口额', value: 8, name2: '5000万美元' },
  { name: '引进总投资', value: 65, name2: '12.3亿元' },
  { value: 65 },
]
console.log('data', data)
export default function Section7(props: React.HTMLAttributes<HTMLElement>) {
  return (
    <Label {...props} title="全力打造＂国家级塑料产业基地＂" divider>
      <ul className="flex-ac flex-col h-full box-border items-stretch p-2">
        {data.map(item => (
          <li>
            <div className="flex-bc mb-1 ">
              <span>{item.name}</span>
              <span>{item.name2}</span>
            </div>
            <div className="bg-[#15326A] rounded h-3 overflow-hidden">
              <div
                className="h-full rounded"
                un-bg-gradient="from-[#072333] to-r to-[#2F89F0]"
                style={{ width: `${item.value}%` }}
              />
            </div>
          </li>
        ))}
      </ul>
    </Label>
  )
}
